 <template>
  <div>
    <tTable :columns="columns" :data="tableData">
      <!-- 账号类型 -->
      <template v-slot:accountType="slotProps">
        <el-tag
          :type="slotProps.scope.row.accountType | statusFilter"
        >{{slotProps.scope.row.accountType === 'PERSON' ? '个人' : '企业'}}</el-tag>
      </template>
      <!-- 提现金额 -->
      <template v-slot:amount="slotProps">￥{{slotProps.scope.row.amount || 0}}</template>
      <!-- 操作 -->
      <template v-slot:operate="slotProps">
        <el-button
          v-if="isReject"
          @click="$emit('reject', slotProps.scope.row.id)"
          type="danger"
          size="small"
        >拒绝</el-button>
        <el-button
          v-if="isAccept"
          @click="$emit('accept', slotProps.scope.row.id)"
          type="primary"
          class="add-style"
          size="small"
        >接受</el-button>
        <el-button
          v-if="isDown"
          @click="$emit('down', slotProps.scope.row.id)"
          type="primary"
          class="add-style"
          size="small"
        >完成</el-button>
      </template>
    </tTable>
  </div>
</template>

<script>
import tTable from "src/components/table/index.vue";

export default {
  filters: {
    statusFilter(status) {
      const statusMap = {
        ORG: "success", // 个人
        PERSON: "danger" // 企业
      };
      return statusMap[status];
    }
  },
  data() {
    return {
      checkIndex: 0,
      searchData: "",
      dialogVisible: false,

      columns: [
        {
          attr: { label: "", type: "index", width: "55" }
        },
        {
          attr: { prop: "name", label: "申请方" }
        },
        {
          attr: { prop: "outerAccount", label: "提现账号", width: "120" }
        },
        {
          attr: { prop: "outerPayMethod", label: "提现方式", width: "100" }
        },
        {
          slot: "accountType",
          attr: { prop: "accountType", label: "账号类型", width: "100" }
        },
        {
          attr: { prop: "realName", label: "姓名", width: "80" }
        },
        {
          attr: { prop: "openId", label: "openId" }
        },
        {
          slot: "amount",
          attr: { prop: "amount", label: "提现金额", width: "100" }
        },
        {
          attr: { prop: "createTime", label: "申请时间", width: "110" }
        },
        {
          slot: "operate",
          attr: { label: "操作", width: "160" }
        }
      ]
    };
  },
  components: { tTable },
  props: [
    "tableData",
    "isRecall",
    "pageSize",
    "total",
    "handleChange",
    "isReject",
    "isAccept",
    "reject",
    "accept",
    "isDown",
    "down"
  ],
  methods: {}
};
</script>

<style lang="scss" scoped>
@import "src/style/mixin";
.longTerm-style {
  color: #888;
  padding: 10px;
}

.input-width {
  width: 400px;
}

.upload-width {
  width: 400px;
}
.cascader-style {
  width: 300px;
  margin-bottom: 20px;
}

.widthBtn {
  width: 200px;
  margin: 20px 200px 0 0;
}
</style>
